@import "../../../app.less";

.wrapper {
  .item {
    margin-top: 20rpx;

    .title {
      display: flex;
      flex-direction: row;
      justify-content: space-between;
      align-items: center;
      border-bottom-width: 1px;
      border-bottom-style: solid;
      border-color: @color-border-light;
      padding: 32rpx;
      background: @color-white;
      font-size: 34rpx;
      font-weight: 600;
      color: @color-text-primary;

      .add {
        padding: 13rpx 12rpx;
        border-radius: 5px;
        background: rgba(0, 65, 196, .2);
        font-size: 0;

        image {
          width: 20rpx;
          height: 20rpx;
        }
      }
    }

    .box {
      background: @color-white;
      padding: 0 32rpx;

      .bill {
        padding: 40rpx 0;
        border-bottom-width: 1px;
        border-bottom-style: solid;
        border-color: @color-border-light;

        .billNum {
          font-size: 32rpx;
          color: @color-text-primary;

          text {
            font-family: Helvetica;
          }
        }

        .number {
          display: flex;
          flex-direction: row;
          justify-content: space-between;
          align-items: center;
          font-size: 30rpx;
          color: @color-text-primary;
          margin-top: 20rpx;

          .pactNum {
            opacity: .6;
            width: calc(100% - 300rpx);
            word-wrap: break-word;
            word-break: normal;
            line-height: 1.5;
          }
        }
      }

      .contract {
        padding: 40rpx 0;
        border-bottom-width: 1px;
        border-bottom-style: solid;
        border-color: @color-border-light;

        .pactNum {
          font-size: 32rpx;
          color: @color-text-primary;

          text {
            font-family: Helvetica;
          }
        }

        .company {
          margin-top: 20rpx;
          font-size: 30rpx;
          color: @color-text-primary;
          opacity: .6;
        }

        .figure {
          font-size: 30rpx;
          color: @color-text-primary;
          margin-top: 20rpx;
        }
      }

      .task {
        padding: 40rpx 0;
        border-bottom-width: 1px;
        border-bottom-style: solid;
        border-color: @color-border-light;

        .taskNum {
          font-size: 32rpx;
          color: @color-text-primary;

          text {
            font-family: Helvetica;
          }
        }

        .number {
          margin-top: 20rpx;
          font-size: 30rpx;
          color: @color-text-primary;
          opacity: .6;
          display: flex;
          flex-direction: row;
          justify-content: safe;

          view:nth-child(1) {
            margin-right: 60rpx;
          }
        }

        .figure {
          font-size: 30rpx;
          color: @color-text-primary;
          margin-top: 20rpx;
        }
      }
    }

    .del {
      background: @color-danger;
      width: 80px;
      height: 100%;
      color: @color-white;
      font-size: 34rpx;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
    }
  }

}